<template>
<div id="app">

    <el-form :inline="true" :model="formSelect" class="demo-form-inline" ref="formSelect">
        <!-- <el-form-item label="所属学院" prop="collegeNumber">
                <el-select size="small" v-model="formSelect.collegeNumber" clearable placeholder="所属学院">
                    <el-option :key="item.collegeNumber" v-for="item in parent" :label="item.collegeName" :value="item.collegeNumber"></el-option>

                </el-select>
      </el-form-item>-->

        <el-form-item label="专业" prop="specialtyNumber">
            <el-select size="small" v-model="formSelect.specialtyNumber" clearable placeholder="专业">
                <el-option :key="item.majorNumber" v-for="item in parentnew" :label="item.majorName" :value="item.majorNumber"></el-option>
            </el-select>
        </el-form-item>

        <el-form-item label="班级" prop="teachingClassName">
            <el-input size="small" v-model="formSelect.teachingClassName" clearable placeholder="班级"></el-input>
        </el-form-item>

        <el-form-item label="姓名" prop="studentName">
            <el-input size="small" v-model="formSelect.studentName" clearable placeholder="姓名"></el-input>
        </el-form-item>

        <el-form-item label="学号" prop="studyNumber">
            <el-input size="small" v-model="formSelect.studyNumber" clearable placeholder="学号"></el-input>
        </el-form-item>

        <el-form-item>
            <el-button size="small" type="primary" @click="onSubmit" icon="el-icon-search">查询</el-button>
            <el-button size="small" @click="resetForm('formSelect')">重置</el-button>
        </el-form-item>
    </el-form>

    <el-table :data="dataList" border v-loading="dataListLoading" style="width: 100%">
        <!-- <el-table-column prop="id" header-align="center" align="center" label="序号">
      </el-table-column>-->
        <el-table-column type="index" header-align="center" align="center" label="序号" width="50"></el-table-column>
        <el-table-column prop="stuNumber" header-align="center" align="center" label="学号"></el-table-column>
        <el-table-column prop="studentName" header-align="center" align="center" label="姓名"></el-table-column>
        <el-table-column prop="sex" header-align="center" align="center" :show-overflow-tooltip="true" label="性别">
            <template v-slot="scope">
                <span v-if="scope.row.sex == 1">男</span>
                <span v-else>女</span>
            </template>
        </el-table-column>
        <el-table-column prop="teachingClassName" header-align="center" align="center" :show-overflow-tooltip="true" label="班级"></el-table-column>
        <el-table-column prop="teacherName" header-align="center" align="center" :show-overflow-tooltip="true" label="班主任"></el-table-column>
        <el-table-column prop="specialty" header-align="center" align="center" :show-overflow-tooltip="true" label="专业"></el-table-column>
        <el-table-column prop="collegeName" header-align="center" align="center" :show-overflow-tooltip="true" label="学院"></el-table-column>
        <!--
        <el-table-column prop="isEnable" header-align="center" align="center" :show-overflow-tooltip="true" label="启停状态">
            <template v-slot="scope">
                <el-switch v-model="scope.row.isEnable" disabled active-color="#13ce66" inactive-color="#ff4949" :active-value="true"
          :inactive-value="false" @change="changeSwitch(scope.row)"></el-switch>
        <span v-if="scope.row.isEnable" style="color:#5daf34">启用</span>
        <span v-else style="color:#dd6161">停用</span>
        </template>
        </el-table-column>-->
        <el-table-column prop="status" header-align="center" align="center" :show-overflow-tooltip="true" label="学籍状态"></el-table-column>
        <el-table-column prop="isSpot" header-align="center" align="center" :show-overflow-tooltip="true" label="是否抽查人员">
            <template v-slot="scope">
                <!-- <span v-if="scope.row.isSpot == true">是</span>
                <span v-else>否</span> -->
                <el-switch v-model="scope.row.isSpot" @change="changeSpotStatus(scope.row)" active-color="#13ce66" inactive-color="#ff4949"></el-switch>
            </template>
        </el-table-column>
        <!-- isSpot -->
        <el-table-column label="操作" header-align="center" align="center">
            <template slot-scope="scope">
                <el-button slot="reference" size="mini" type="primary" @click="resetPassword(scope.row.id)">重置密码</el-button>
            </template>
        </el-table-column>
    </el-table>
    <el-pagination class="pagination" background @size-change="sizeChangeHandle" @current-change="currentChangeHandle" :current-page="pageIndex" :page-sizes="[10, 20, 50, 100]" :page-size="pageSize" :total="totalPage" layout="total, sizes, prev, pager, next, jumper"></el-pagination>
</div>
</template>

<script>
import {
    getData,
    getListData,
    getListDataNew,
    getListDataNewOne,
    resetPassWord,
    updateSpotStatus
} from '../../api/src/StudentList/StudentList'
export default {
    name: 'teachingClassStudent_archives',
    data() {
        return {
            isEnable: true,
            formSelect: {
                collegeNumber: '',
                specialtyNumber: '',
                teachingClassName: '',
                studentName: '',
                studyNumber: '',
            },
            dataList: [],
            parent: [],
            parentnew: [],
            parentnewone: [],
            pageIndex: 1,
            pageSize: 10,
            password: 2018,
            totalPage: this.totalPage,
            dataListLoading: false,
            selectionDataList: [],
            filter: {
                collegeNumber: '',
                specialtyNumber: '',
                studentName: '',
                studentNumber: '',
                teachingClassName: '',
            },
            ck: false,
        }
    },
    created() {
        this.getDataList(false)
        // this.getInputList()
        this.getInput()
        this.getInputNew()
    },
    methods: {
        // 获取数据列表
        getDataList(ck) {
            this.dataListLoading = true
            if (ck == false) {
                // 不进行选择默认
                getData(this.pageIndex, this.pageSize).then((res) => {
                    if (res.records === 0) {
                        this.dataList = []
                        this.totalPage = 0
                    } else {
                        this.dataList = res.records
                        this.totalPage = res.total
                    }
                    this.dataListLoading = false
                })
            } else {
                // 进行选择
                getData(this.pageIndex, this.pageSize, this.filter).then((res) => {
                    if (res.records === 0) {
                        this.dataList = []
                        this.totalPage = 0
                    } else {
                        this.dataList = res.records
                        this.totalPage = res.total
                    }
                    this.dataListLoading = false
                })
            }
        },
        getInputList() {
            getListData().then((res) => {
                this.parent = res
            })
        },

        async getInput() {
            await getListDataNew().then((res) => {
                this.parentnew = res
            })
        },
        async getInputNew() {
            await getListDataNewOne().then((res) => {
                this.parentnewone = res
            })
        },
        resetForm(formName) {
            this.$refs[formName].resetFields()
            this.pageIndex = 1
            this.getDataList(false)
        },
        onSubmit() {
            this.dataList = []
            this.totalPage = 0
            this.filter = {}
            this.ck = false
            this.pageIndex = 1
            let data
            if (this.formSelect.studyNumber.length != 0) {
                data = {
                    stuNumber: this.formSelect.studyNumber,
                }
                this.filter = Object.assign({}, this.filter, data)
                this.ck = true
            }
            if (this.formSelect.studentName.length != 0) {
                data = {
                    studentName: this.formSelect.studentName,
                }
                this.filter = Object.assign({}, this.filter, data)
                this.ck = true
            }
            if (this.formSelect.teachingClassName.length != 0) {
                data = {
                    teachingClassName: this.formSelect.teachingClassName,
                }
                this.filter = Object.assign({}, this.filter, data)
                this.ck = true
            }
            if (this.formSelect.specialtyNumber.length != 0) {
                data = {
                    specialtyNumber: this.formSelect.specialtyNumber,
                }
                this.filter = Object.assign({}, this.filter, data)
                this.ck = true
            }
            if (this.formSelect.collegeNumber.length != 0) {
                data = {
                    collegeNumber: this.formSelect.collegeNumber,
                }
                this.filter = Object.assign({}, this.filter, data)
                this.ck = true
            }

            this.getDataList(this.ck)
        },
        resetPassword(id) {
            this.getDataList(false)
            this.$confirm('确定重置密码?', '提示', {
                    confirmButtonText: '确定',
                    cancelButtonText: '取消',
                    type: 'warning',
                })
                .then(() => {
                    let n = 0
                    for (let i = 0; i < this.dataList.length; i++) {
                        if (this.dataList[i].id == id) {
                            n = i
                        }
                    }
                    let number = this.dataList[n].stuNumber.toString()
                    resetPassWord(number).then((res) => {
                        this.$message({
                            showClose: true,
                            message: '恭喜你，重置密码成功！',
                            type: 'success',
                        })
                    })
                })
                .catch(() => {})
        },
        // 每页数
        sizeChangeHandle(val) {
            this.dataList = []
            this.pageSize = val
            this.pageIndex = 1
            this.getDataList(this.ck)
        },
        // 当前页
        currentChangeHandle(val) {
            this.dataList = []
            this.pageIndex = val
            this.getDataList(this.ck)
        },
        // 状态更新
        async changeSpotStatus(student) {
            console.log(student.id)
            const data = await updateSpotStatus({
                id: student.id,
                type: 1,
                value: student.isSpot ? 1 : 0,
            })
            this.$message.success(data)
        }
    },
}
</script>

<style>
</style>
